---
import BaseLayout from '../../layouts/BaseLayout.astro';
import NewsItem from '../../components/NewsItem.astro';

// 新闻数据
const newsItems = [
    {
        id: "88",
        title: "The Evening Special Visit 2025 spring",
        date: "Mar 06, 2025",
        href: "/news/evening-special-visit-2025"
    },
    {
        id: "406", 
        title: "The documentary film \"Kiyomizu – Cycle of Blessings\" is released.",
        date: "Feb 03, 2025",
        href: "/news/documentary-film-released"
    },
    {
        id: "365",
        title: "In C-60th Birthday Full Moon Celebration / FEEL KIYOMIZUDERA",
        date: "Nov 19, 2024", 
        href: "/news/full-moon-celebration"
    },
    {
        id: "299",
        title: "Oct. 18 – Nov. 8, 2024 film exhibition \"Kiyomizu – Cycle of Blessings\"",
        date: "Oct 08, 2024",
        href: "/news/film-exhibition-2024"
    },
    {
        id: "255",
        title: "Notice to visitors",
        date: "Oct 12, 2023",
        href: "/news/notice-to-visitors"
    },
    {
        id: "185",
        title: "\"TIME\" Archive page Opened. / FEEL KIYOMIZUDERA",
        date: "Aug 18, 2022",
        href: "/news/time-archive-opened"
    }
];
---

<BaseLayout 
    title="NEWS | KIYOMIZU-DERA TEMPLE" 
    description="Enjoy the stunning up-to-date information of Kiyomizu-dera Temple."
    pageClass="page-sub page-news page-news_category"
    ogImage="/img/common/ogp/news.jpg"
>
    <div id="main">
        <section id="head" class="section1_1">
            <h1><span class="k" style="letter-spacing: 0.12em;">N</span><span class="k" style="letter-spacing: 0.11em;">E</span><span class="k" style="letter-spacing: 0.03em;">W</span>S</h1>
        </section>
        
        <section class="list">
            <div class="section_wrap">
                {newsItems.map((item) => (
                    <NewsItem 
                        id={item.id}
                        title={item.title}
                        date={item.date}
                        href={item.href}
                    />
                ))}
            </div>
        </section>
        
        <section class="foot_pager">
            <div class="section_wrap">
                <div class="pager">
                    <span class="current_page">1</span>&nbsp;
                    <a href="#" class="link_page">2</a>&nbsp;
                </div>
                <div class="arr">
                    <a href="#" class="link_next">&gt;</a>
                </div>
            </div>
        </section>
    </div>
</BaseLayout>
